<template>
  <div class="page-container">

    <el-form ref="form" :model="form" :label-width="$globalCss.formLabelWidth_default" class="common-form-panel-div"
      style="margin-bottom: 100px;" v-loading="loading" :rules="formRules">
      <ex_header_spiler :title="$t('label_base_info')"></ex_header_spiler>

      <el-form-item :label="$t('label_line_name')" class="mg_t2" prop="tmsLineInfoParam.lineName">
        <div class="bold form_input_small"> {{ form.tmsLineInfoParam.lineName }}</div>
      </el-form-item>

      <el-form-item :label="$t('label_line_status')">
        <div class="flex_row">
          <div :class="'bold   mg_r2 ' + (form.tmsLineInfoParam.status == 'ENABLE' ? 'color_success' : 'color_danger')">
            {{ $enumShow(form.tmsLineInfoParam.status, 'IsAvailableStatusEnum') }}
          </div>
          <el-button :type="form.tmsLineInfoParam.status != 'ENABLE' ? 'success' : 'danger'"
            @click="enableOrDisable('line', form.tmsLineInfoParam)">
            {{ form.tmsLineInfoParam.status != 'ENABLE' ? $tt('label_start_using') : $tt('label_stop_using') }}
          </el-button>
        </div>
      </el-form-item>
      <el-form-item :label="$t('label_origin')" prop="tmsLineInfoParam.originPlaceId">
        <div class="flex_row">
          <div class="bold form_input_small">
            {{ $formatNameCode(form.tmsLineInfoParam.originCountryName, form.tmsLineInfoParam.originCountryCode) }}</div>
          <div class="bold form_input_small">
            {{ form.tmsLineInfoParam.originPlaceName }}</div>
          <el-button @click="$refs.transportAreaOrigin.show()">{{ $tt('label_logistics_division_config') }}
          </el-button>
        </div>


        <transport-area-edit :disabled="true" ref="transportAreaOrigin" :areaIds="form.tmsLineInfoParam.originAreaIds"
          :countryCode="form.tmsLineInfoParam.originCountryCode" :countryName="form.tmsLineInfoParam.originCountryName"
          @afterSubmitSuccess="list => form.tmsLineInfoParam.originAreaIds = list.map(it => it.id)"></transport-area-edit>

      </el-form-item>

      <el-form-item :label="$t('label_destination')" prop="tmsLineInfoParam.destinationPlaceId">
        <div class="flex_row">
          <div class="bold form_input_small">
            {{ $formatNameCode(form.tmsLineInfoParam.destinationCountryName, form.tmsLineInfoParam.destinationCountryCode)
            }}</div>
          <div class="bold form_input_small">
            {{ form.tmsLineInfoParam.destinationPlaceName }}</div>
          <el-button @click="$refs.transportAreaDestination.show()">{{ $tt('label_logistics_division_config') }}
          </el-button>
        </div>
        <transport-area-edit :disabled="true" ref="transportAreaDestination" :areaIds="form.tmsLineInfoParam.destAreaIds"
          :countryCode="form.tmsLineInfoParam.destinationCountryCode"
          :countryName="form.tmsLineInfoParam.destinationCountryName"
          @afterSubmitSuccess="list => form.tmsLineInfoParam.destAreaIds = list.map(it => it.id)"></transport-area-edit>
      </el-form-item>



<!--      <el-row>
        <el-col :span="3">
          <el-form-item :label="$tt('label_srm_transport_traffic_limitation')">

            <div style="display: flex;  " class="product-line-limit-div">
              &lt;!&ndash;              <div class="product-line-limit-col" style="width: 200px;">干线运输方式</div>&ndash;&gt;
              <div class="product-line-limit-col">{{ $tt('label_pms_weight_range') }}</div>
              <div class="product-line-limit-col">{{ $tt('label_pms_volume_range') }}</div>
              <div class="product-line-limit-col">{{ $tt('label_pms_max_lengh') }}</div>
            </div>

            <div class="product-line-limit-div flex_row_center">

              <div class="product-line-limit-col  flex_row_center">
                <div class="bold w_fill">
                  {{ form.tmsLineInfoParam.minWeight }}</div>
                <div style="padding: 0px 4px;">{{ $tt('label_srm_transport_to') }}</div>
                <div class="bold w_fill">
                  {{ form.tmsLineInfoParam.maxWeight }}</div>
              </div>

              <div class="product-line-limit-col flex_row_center">
                <div class="bold w_fill">
                  {{ form.tmsLineInfoParam.minVolume }}</div>

                <div style="padding: 0px 4px;">{{ $tt('label_srm_transport_to') }}</div>
                <div class="bold w_fill">
                  {{ form.tmsLineInfoParam.maxVolume }}</div>


                <div class="product-line-limit-col flex_row_center">
                  <div class="bold w_fill">
                    {{ form.tmsLineInfoParam.maxBorder }}</div>
                </div>

              </div>
            </div>
          </el-form-item>
        </el-col>
      </el-row>



      <el-form-item :label="$tt('label_tms_line_aging')" prop="tmsLineInfoParam.prescription">
        <div class="bold form_input_default">
          {{ form.tmsLineInfoParam.prescription }}</div>
      </el-form-item>-->


      <ex_header_spiler :title="$t('label_route_option')"></ex_header_spiler>

      <div style="position: relative;">
        <el-tabs v-model="activeName" @tab-click="handleTabClick">

          <el-tab-pane v-for="route, routeIndex in form.routeAndSectionDTOList" :label="route.routeName"
            :key="'route_id_' + routeIndex" :name="String(routeIndex)">

            <el-form ref="formRoute" :model="route" :label-width="$globalCss.formLabelWidth_default"
              style="margin-top: 18px;" :rules="formRulesRoute">
              <el-form-item :label="$tt('label_pms_main_transport_type')" prop="trunkLineMode">
                <div class="flex_row_center">
                  <div class="bold">{{ $enumShow(route.trunkLineMode, "LogisticsProductsTypeEnum") }}</div>

                </div>
              </el-form-item>

              <el-form-item :label="$tt('label_tms_line_route_name')" prop="routeName">
                <div class="bold form_input_default">
                  {{ route.routeName }}</div>
              </el-form-item>
              <el-form-item :label="$t('label_route_status')">
                <div class="flex_row">
                  <div :class="'bold   mg_r2 ' + (route.status == 'ENABLE' ? 'color_success' : 'color_danger')">
                    {{ $enumShow(route.status, 'IsAvailableStatusEnum') }}</div>
                  <el-button :type="route.status != 'ENABLE' ? 'success' : 'danger'"
                    @click="enableOrDisable('route', route)">
                    {{ route.status != 'ENABLE' ? $tt('label_start_using') : $tt('label_stop_using') }}
                  </el-button>
                </div>
              </el-form-item>
              <el-form-item :label="$tt('label_srm_transport_supported_packaging')" prop="isSustainMany">
                <div class="flex_row">
                  <div class="bold mg_r2">{{ $tt('label_srm_transport_one_one') }}</div>

                  <div class="bold mg_l2">{{ $tt('label_srm_transport_one_more') }}</div>
                </div>

              </el-form-item>

              <el-form-item :label="$tt('label_tms_path_point_config')" prop="createOrUpdateRouteSectionDTOList">
                <div class="manage-path-point-row">
                  <div class="manage-path-point-address cursor_pointer flex_col_center"
                    v-if="form.tmsLineInfoParam.originPlaceId">
                    {{ form.tmsLineInfoParam.originPlaceName }}
                    <div class="manage-path-point-desc">
                      <span>{{ $tt('label_origin') }}</span>
                    </div>
                  </div>
                  <div style="display: flex;">
                    <div class="manage-path-point-line"></div>
                    <div class="manage-path-point-arrow"></div>
                  </div>
                  <template v-for="item, index in route.createOrUpdateRouteSectionDTOList">
                    <div class="manage-path-point-address cursor_pointer flex_col_center"
                      @mouseover="$set(item, 'showRemove', true)" @mouseleave="$set(item, 'showRemove', false)">
                      {{ item.placeName }}
                    </div>
                    <template>
                      <div style="display: flex;">
                        <div class="manage-path-point-line"></div>
                        <div class="manage-path-point-arrow"></div>
                      </div>
                    </template>
                  </template>
                  <div class="manage-path-point-address cursor_pointer flex_col_center"
                    v-if="form.tmsLineInfoParam.destinationPlaceId">
                    {{ form.tmsLineInfoParam.destinationPlaceName }}
                    <div class="manage-path-point-desc">
                      <span>{{ $tt('label_destination') }}</span>
                    </div>
                  </div>
                </div>
              </el-form-item>

              <!-- 运营方案 -->
              <template v-for="scheme, schemeIndex in route.createAndUpdateOperationSchemeInfoList">
                <el-form ref="formRouteScheme" :model="scheme" :label-width="$globalCss.formLabelWidth_default"
                  :rules="formRulesRouteScheme">
                  <div class="flex_row_center ">
                    <div class="flex_cell"
                      style="margin-top: 10px; padding: 0px 0px 0px 20px; color: #409EFF; font-weight: bold; ">
                      {{ $tt('label_tms_line_operation_project') }}{{ schemeIndex + 1 }}</div>

                  </div>

                  <el-form-item :label="$tt('label_tms_line_operation_project_name')" class=" mg_t2" prop="schemeName">
                    <div class="bold form_input_default">
                      {{ scheme.schemeName }}</div>

                  </el-form-item>
                  <el-form-item :label="$t('label_operation_plan_status')">
                    <div class="flex_row">
                      <div :class="'bold   mg_r2 ' + (scheme.status == 'ENABLE' ? 'color_success' : 'color_danger')">
                        {{ $enumShow(scheme.status, 'IsAvailableStatusEnum') }}</div>
                      <el-button :type="scheme.status != 'ENABLE' ? 'success' : 'danger'"
                        @click="enableOrDisable('scheme', scheme)">
                        {{ scheme.status != 'ENABLE' ? $tt('label_start_using') : $tt('label_stop_using') }}
                      </el-button>
                    </div>
                  </el-form-item>
                  <div class="flex_row ">
                    <el-form-item :label="$tt('label_tms_line_exit_port')" prop="outPortId">
                      <div class="bold form_input_small">
                        {{ scheme.outPortName }}</div>
                    </el-form-item>

                    <el-form-item :label="$tt('label_tms_line_port_entry')" prop="entryPortId">
                      <div class="bold form_input_small">
                        {{ scheme.entryPortName }}</div>
                    </el-form-item>
                  </div>

                  <el-row>
                    <el-col :span="2">
                      <el-form-item :label="$tt('label_tms_line_operation_project_remark')" prop="remark">
                        <div class="bold ">
                          {{ scheme.remark }}</div>
                      </el-form-item>
                    </el-col>
                  </el-row>

                  <el-form-item :label="$tt('label_tms_line_transport_section')" prop="transportSegmentInfoParamList">

                    <div class="flex_row">
                      <div style="margin-top: 40px;">
                        <div class="line-edit-row" v-for="item, index in listRouteSection(route)">
                          <div class="line-edit-row-point"></div>
                          <div class="line-edit-row-line" v-if="index < listRouteSection(route).length - 1">
                          </div>
                          <div class="line-edit-row-title">{{ item.placeName }}</div>
                        </div>
                      </div>
                      <div class="flex_cell flex_col">
                        <el-table :data="scheme.transportSegmentInfoParamList" height="auto" class="flex_cell"
                          :row-style="{ height: '55px' }">
                          <el-table-column prop="transportSection" :label="$tt('label_tms_line_transport_section_type')"
                            width="160" align="center" show-overflow-tooltip>
                            <template v-slot="{ row, $index }">
                              <div class="bold">{{ $enumShow(row.transportSection, 'TransportSectionEnum')
                              }}
                              </div>
                            </template>
                          </el-table-column>
                          <el-table-column prop="transportModel" :label="$tt('label_tms_line_transport_mode')" width="160"
                            align="center" show-overflow-tooltip>
                            <template v-slot="{ row }">
                              <div class="bold">{{ $enumShow(row.transportModel,
                                'LogisticsProductsTypeEnum')
                              }}
                              </div>
                            </template>
                          </el-table-column>
                          <el-table-column prop="loadingMode" :label="$tt('label_tms_line_load_mode')" width="160"
                            align="center" show-overflow-tooltip>
                            <template v-slot="{ row }">
                              <div class="bold">{{ $enumShow(row.loadingMode, 'LoadingModeEnum') }}</div>

                            </template>
                          </el-table-column>
                          <el-table-column prop="prescription" :label="$tt('label_tms_line_aging')" width="160"
                            align="center" show-overflow-tooltip>
                            <template v-slot="{ row }">
                              <div class="bold">{{ row.prescription }}</div>
                            </template>
                          </el-table-column>
                          <el-table-column prop="carrierName" :label="$tt('label_tms_line_carrier_matching')" width="240"
                            align="center" show-overflow-tooltip>
                            <template v-slot="{ row }">
                              <div class="bold">{{ row.carrierName }}</div>
                            </template>
                          </el-table-column>
                        </el-table>
                      </div>
                    </div>
                  </el-form-item>

                </el-form>

              </template>


            </el-form>
          </el-tab-pane>

        </el-tabs>
      </div>

    </el-form>



  </div>
</template>
<script>

import LinePriceCfg from '@/component/pms/transport_price_cfg.vue'

import TransportAreaEdit from '@/component/pms/transport-area-edit.vue'

import place_select from '@/component/tms/place_select'
const default_scheme_info = {
  segmentSort: 0,//	integer 	路由段排序
  carrierId: null,//	long 	承运商id
  carrierName: "",//	string 	承运商名称
  transportSection: "",//	TransportSectionEnum 	运输段（提货: PICK_UP_GOODS 提货, TRUNK_LINE 干线, DISTRIBUTION 配送
  transportModel: "",//	LogisticsProductsTypeEnum 	运输模式（海运、空运、铁运、陆运、国际快递）: SEA_TRANSPORT 海运, SKY_TRANSPORT 空运, LORRY_NAVIGATE 陆运, INTERNATIONAL_EXPRESS 国际快递, IRON_TRANSPORT 铁运
  serviceItemList: "",//	string 	增值服务项（每个服务之间使用“,”分割）
  loadingMode: "BULK_CARGO",//	LoadingModeEnum 	装载方式(散货、整箱，整车): BULK_CARGO 散货, FULL_CONTAINER 整箱, COMPLETE_VEHICLE 整车
  prescription: 0,//	integer 	运输时效
  originPlaceId: null,//	long 	起点地点id
  destinationPlaceId: null,//	long 	终点地点id
}
const default_scheme = {
  "schemeName": "",
  "outPortId": "",
  "outPortName": "",
  "entryPortId": "",
  "entryPortName": "",
  "remark": "",
  transportSegmentInfoParamList: []
}
const default_route =
{
  "routeOwner": "SELF_SUPPORT",//LineOwnerEnum 线路所属（自营/第三方）: SELF_SUPPORT 自营, THIRD_PARTY 第三方
  "routeName": "陆运专线",
  routeNumber: 0,
  trunkLineMode: 'LORRY_NAVIGATE',//LogisticsProductsTypeEnum
  isSustainMany: 'N',
  createOrUpdateRouteSectionDTOList: [],
  "createAndUpdateOperationSchemeInfoList": []
}

const default_obj = {
  //线路信息
  "tmsLineInfoParam": {
    "lineName": "",//线路名称
    "lineOwner": "SELF_SUPPORT",//LineOwnerEnum 线路所属（自营/第三方）: SELF_SUPPORT 自营, THIRD_PARTY 第三方
    "prescription": 0,
    originCountryName: null,
    originCountryCode: null,
    destinationCountryName: null,
    destinationCountryCode: null,
    originAreaIds: [],
    destAreaIds: [],
    originPlaceId: null,
    originPlaceName: "",
    destinationPlaceId: null,
    destinationPlaceName: "",
    "minWeight": null,
    "maxWeight": null,
    "minVolume": null,
    "maxVolume": null,
    "maxBorder": null,
    "expression": null,
    ruleType: 'SIMPLE',//PmsTransportRuleTypeEnum 限制的校验方式: SIMPLE 简单校验模式, EXPRESSION 表达式模式
  },
  "routeAndSectionDTOList": [],
}
import router_params from '@/mixin/router_params';
export default {
  components: { place_select, LinePriceCfg, TransportAreaEdit },
  mixins: [router_params],

  data() {


    return {
      edit: false,
      detail: true,
      tempCountryCode: null,
      tempPlaceType: null,
      tempPlaceId: null,
      tempPlace: null,

      loading: false,
      submiting: false,

      form: _.cloneDeep(default_obj),
      formRules: {

      },
      formRulesRoute: {

      },
      formRulesRouteScheme: {

      },
      "activeName": "0",




    };
  },


  methods: {
    enableOrDisable(type, item) {
      let url = ""
      if (type == 'line') {
        url = '/tms-api/base/TmsLineInfoRpc/enableOrDisable.json'
      } else if (type == 'route') {
        url = '/tms-api/base/TmsRouteInfoRpc/enableOrDisable.json'
      } else {
        url = '/tms-api/base/TmsOperationSchemeInfoRpc/enableOrDisable.json'
      }
      let status = item.status == 'ENABLE' ? 'DISABLED' : 'ENABLE'
      this.$confirm(status == 'ENABLE' ? this.$tt('text_confirm_sure_start_using_operate') : this.$tt('text_confirm_sure_stop_using_operate'), this.$tt('label_tip'), {
        type: 'warning'
      }).then(() => {
        this.$ajax({
          url,
          method: 'post',
          data: { id: item.id, status: item.status == 'ENABLE' ? 'DISABLED' : 'ENABLE' },
          loading: true,
          success: (res) => {
            this.$message.success(this.$tt('tip_submit_success'))
            this.refresh_data()
          }
        })
      }).catch(() => {

      });

    },
    init_data_default(into_params) {

      this.form = _.cloneDeep(default_obj)
      this.$ajax({
        url: "/tms-api/base/TmsLogisticsLineRpc/selectLogisticsLineByLineId.json",
        method: 'post',
        data: { lineId: into_params.id },
        success: (res) => {
          this.loading = false
          this.fixGetData(res.data)
          this.form = Object.assign(_.cloneDeep(default_obj), res.data)
          this.fixTabLabel()
        }
      })
      this.fixTabLabel()
    },
    fixTabLabel() {

      this.$emit('tagModifyLabel', {
        _key: "label_logistics_route_detail",
        code: this.form.tmsLineInfoParam.lineName || ""
      })
    },

    listRouteSection(route) {
      if (this.form.tmsLineInfoParam.originPlaceId == null || this.form.tmsLineInfoParam.destinationPlaceId == null) {
        return []
      }

      return [{ placeId: this.form.tmsLineInfoParam.originPlaceId, placeName: this.form.tmsLineInfoParam.originPlaceName },
      ...route.createOrUpdateRouteSectionDTOList,
      { placeId: this.form.tmsLineInfoParam.destinationPlaceId, placeName: this.form.tmsLineInfoParam.destinationPlaceName },]
    },
    refreshRouteSection(route) {
      const routeList = this.listRouteSection(route)//oute.createOrUpdateRouteSectionDTOList
      routeList.forEach((it, i) => it.sort = i + 1)

      route.createAndUpdateOperationSchemeInfoList.forEach(scheme => {
        let newSegment = []

        for (let i = 0; i < routeList.length - 1; i++) {
          const originPlace = routeList[i]
          const destinationPlace = routeList[i + 1]
          let segmentItem = null
          if (i < scheme.transportSegmentInfoParamList.length) {
            segmentItem = scheme.transportSegmentInfoParamList[i]
          } else {
            segmentItem = _.cloneDeep(default_scheme_info)
            // segmentItem.transportModel = route.trunkLineMode
          }
          segmentItem.segmentSort = i + 1
          segmentItem.originPlaceId = originPlace.placeId
          segmentItem.destinationPlaceId = destinationPlace.placeId
          newSegment.push(segmentItem)
        }

        scheme.transportSegmentInfoParamList = newSegment
      })

      this.refreshRouteSectionTrunk(route)
    },
    changeTransportSection(e, item, route) {
      if (e == "TRUNK_LINE") {
        item.transportModel = route.trunkLineMode
      } else if (e == "DISTRIBUTION" || e == "PICK_UP_GOODS") {
        item.transportModel = "LORRY_NAVIGATE"
      } else {
        item.transportModel = null
      }
    },
    refreshRouteSectionTrunk(route) {
      route.createAndUpdateOperationSchemeInfoList.forEach(scheme => {
        for (let i = 0; i < scheme.transportSegmentInfoParamList.length; i++) {
          let item = scheme.transportSegmentInfoParamList[i]
          if (i == 0) {
            item.transportModel = "LORRY_NAVIGATE"
            item.transportSection = "PICK_UP_GOODS"
          } else {
            this.changeTransportSection(item.transportSection, item, route)
          }
        }
      })
    },
    removeRoute(list, i) {
      this.form.routeAndSectionDTOList.splice(i, 1)
      if (this.form.routeAndSectionDTOList.length > 0) {
        this.activeName = String(0)
      }
    },

    addScheme(route) {
      route.createAndUpdateOperationSchemeInfoList.push(_.cloneDeep(default_scheme))
      this.refreshRouteSection(route)
    },
    handleTabClick() {

    },
    submit: _.throttle(function (item) {
      this.submitForm()
    }, 700),
    submitForm() {

      let formRouteNoCheck = false
      if (this['$refs']['form']) {
        this['$refs']['form'].validate((valid) => {
          if (!valid) {
            formRouteNoCheck = true
          }
        });
      }

      if (this['$refs']['formRoute']) {
        this['$refs']['formRoute'].forEach(formRoute => {
          formRoute.validate((formRoutevalid) => {
            if (!formRoutevalid) {
              formRouteNoCheck = true
            }
          });
        })
      }
      if (this['$refs']['formRouteScheme']) {
        this['$refs']['formRouteScheme'].forEach(formScheme => {
          formScheme.validate((formSchemevalid) => {
            if (!formSchemevalid) {
              formRouteNoCheck = true
            }
          });
        })
      }


      if (formRouteNoCheck) {
        this.$message.error(this.$tt('form_validate_error'))
      } else {

        this.submitNet()
      }

    },

    submitNet() {

      if (this.form.tmsLineInfoParam.id) {
        this.updateRemote()
      } else {
        this.saveRemote()
      }
    },
    fixGetData(data) {
      data.routeAndSectionDTOList.forEach(route => {
        let originIndex = _.findIndex(route.createOrUpdateRouteSectionDTOList, it => it.placeId == data.tmsLineInfoParam.originPlaceId)

        if (originIndex >= 0) {
          route.createOrUpdateRouteSectionDTOList.splice(originIndex, 1)
        }

        let destinationIndex = _.findIndex(route.createOrUpdateRouteSectionDTOList, it => it.placeId == data.tmsLineInfoParam.destinationPlaceId)
        if (destinationIndex >= 0) {
          route.createOrUpdateRouteSectionDTOList.splice(destinationIndex, 1)
        }

      })
    },

    fixSubmitData(data) {
      data.routeAndSectionDTOList.forEach(route => {
        route.createOrUpdateRouteSectionDTOList.splice(0, 0, {
          placeId: data.tmsLineInfoParam.originPlaceId,
          placeName: data.tmsLineInfoParam.originPlaceName,
        })
        route.createOrUpdateRouteSectionDTOList.push({
          placeId: data.tmsLineInfoParam.destinationPlaceId,
          placeName: data.tmsLineInfoParam.destinationPlaceName,
        })
        // if (!route.createOrUpdateRouteSectionDTOList.some(it => it.placeId == data.tmsLineInfoParam.originPlaceId)) {
        //   route.createOrUpdateRouteSectionDTOList.splice(0, 0, {
        //     placeId: data.tmsLineInfoParam.originPlaceId,
        //     placeName: data.tmsLineInfoParam.originPlaceName,
        //   })
        // }
        // if (!route.createOrUpdateRouteSectionDTOList.some(it => it.placeId == data.tmsLineInfoParam.destinationPlaceId)) {
        //   route.createOrUpdateRouteSectionDTOList.push({
        //     placeId: data.tmsLineInfoParam.destinationPlaceId,
        //     placeName: data.tmsLineInfoParam.destinationPlaceName,
        //   })
        // }
        route.createOrUpdateRouteSectionDTOList.forEach((it, index) => it.sort = (index + 1))
      })
    },

    saveRemote() {
      let data = _.cloneDeep(this.form)
      this.fixSubmitData(data)
      this.submiting = true
      this.$ajax({
        url: '/tms-api/base/TmsLogisticsLineRpc/save.json',
        method: 'post', type: 'json',
        data,
        success: (responseData) => {
          this.$message.success(this.$tt('tip_submit_success'))

          this.return_emit(null, "reload")
          this.pageBack()
        },
        complete: () => {
          this.submiting = false
        }
      });
    },
    updateRemote() {
      let data = _.cloneDeep(this.form)
      this.fixSubmitData(data)
      this.submiting = true
      this.$ajax({
        url: '/tms-api/base/TmsLogisticsLineRpc/update.json',
        method: 'post', type: 'json',
        data,
        success: (responseData) => {
          this.$message.success(this.$tt('tip_submit_success'))
          this.return_emit(null, "reload")
          this.pageBack()
        },
        complete: () => {
          this.submiting = false
        }
      });
    },
    pageBack() {
      this.$tag.tagClose(null, this.intoPath)
    },
  }
};

</script>
<style>
.line-edit-row {
  position: relative;
  height: 55px;
}

.line-edit-row-title {
  text-align: right;
  line-height: 16px;
  margin-right: 22px;
}

.line-edit-row-point {
  position: absolute;
  width: 12px;
  height: 12px;
  background-color: #e4e7ed;
  border-radius: 50%;
  right: 0;
  margin-top: 2px;
}

.line-edit-row-line {
  position: absolute;
  width: 2px;
  height: 100%;
  background-color: #e4e7ed;
  top: 10px;
  right: 6px;
}

.line-edit-row-form {
  position: absolute;
  width: 930px;
  left: 258px;
  top: 22px;
}

.line-edit-row-form .line-edit-row-form-line {
  display: flex;
  line-height: 36px;
  height: 36px;
  width: 100%;
}

.line-edit-row-form .line-edit-row-form-line .line-edit-row-form-col {
  width: 160px;
  text-align: center;
  margin-right: 10px;
}

/*途经点配置 */
.manage-path-point-row {
  display: flex;
  flex-wrap: wrap;
}

.manage-path-point-row .manage-path-point-address {
  width: auto;
  padding: 0px 8px;
  position: relative;

}

.cursor_pointer {
  cursor: pointer;
}

.manage-path-point-row .manage-path-point-address .manage-path-point-desc {

  /*border: 1px solid #b3d8ff;*/
  text-align: center;
}

.manage-path-point-row .manage-path-point-address .manage-path-point-desc span {
  color: #409eff;
  border: 1px solid #b3d8ff;
  padding: 2px 4px;
  border-radius: 8px 8px;
}

.manage-path-point-row .manage-path-point-line {
  width: 40px;
  height: 2px;
  border-top: 4px solid #DCDFE6;
  margin-top: 14px;
}

.manage-path-point-row .manage-path-point-arrow {
  width: 0px;
  height: 0px;
  margin-top: 8px;
  border-bottom: 8px solid transparent;
  border-top: 8px solid transparent;
  border-left: 8px solid #DCDFE6;
  font-size: 0;
  line-height: 0;
}

.product-line-limit-div,
.product-line-limit-div-2 {
  display: flex;
}


.product-line-limit-div .product-line-limit-col {
  width: 220px;
  text-align: center;
  margin-right: 10px;
}

.product-line-limit-div-2 div {
  width: 300px;
  /*text-align: center;*/
  margin-right: 10px;
}
</style>
